<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title>记住密码提示框</title>
  <style>
    body, input, p {
      margin: 0;
      padding: 0;
    }

    body {
      font: 12px/1.5 Tahoma;
    }

    #outer {
      width: 200px;
      margin: 100px auto;
    }

    input {
      margin-right: 5px;
      vertical-align: middle;
    }

    #tips {
      padding: 5px;
      margin-top: 5px;
      background: #ffefa4;
      border: 1px solid #f90;
      display: none;
    }
  </style>
  <script>
    window.onload = function () {
      var oTips = document.getElementById("tips");
      var oLabel = document.getElementsByTagName("label")[0];

      oLabel.onmouseover = function () {
        oTips.style.display = "block"
      };
      oLabel.onmouseout = function () {
        oTips.style.display = "none"
      }
    }
  </script>
</head>

<body>
<div id="outer">
  <label>
    <input type="checkbox"/>两周内自动登陆
  </label>
  <div id="tips">为了您的信息安全，请不要在网吧或公用电脑上使用此功能！</div>
</div>
</body>

</html>
